'use strict';
import React from 'react';
import {
    ListView,
    Text,
    View,
    TouchableOpacity,
} from 'react-native';
import {_renderAvatar} from '../Utils/ViewUtils';
import Global from '../Commom/GlobalConst';

/**
 * 发现各详情界面的ListView
 */
class FoundDetailsListView extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            dataSource: new ListView.DataSource({
                rowHasChanged: (r1, r2) => r1 !== r2
            }),
        };
    }

    componentDidMount() {
    }

    _renderComRow(row) {
        let {isQuestion} = this.props;
        return (
            <View style={{
                borderBottomColor: '#F2F3F5',
                borderBottomWidth: 1,
            }}>
                {_renderAvatar(row)}
                <View style={{
                    marginLeft: 50,
                    marginBottom: 10,
                    flexDirection: 'row',
                    alignItems: 'center',
                }}>
                    <Text style={{
                        flex: 1,
                        marginRight: 5,
                        fontSize: 15,
                        color: Global.FontColor.LightGrey,
                        lineHeight: 25,
                    }}>{row.content}</Text>
                    {
                        isQuestion ?
                            <TouchableOpacity>
                                <Text style={{
                                    borderRadius: 5,
                                    color: 'white',
                                    padding: 5,
                                    backgroundColor: '#F9B552',
                                    fontSize: 14
                                }}>打赏10</Text>
                            </TouchableOpacity> : null
                    }
                </View>
            </View>
        );
    }

    render() {
        return (
            <ListView
                enableEmptySections={true}
                dataSource={this.state.dataSource.cloneWithRows(this.props.commentList)}
                renderRow={(row) => this._renderComRow(row)}
                style={{
                    backgroundColor: 'white',
                }}
            />
        );
    }
}

FoundDetailsListView.propTypes = {
    commentList: React.PropTypes.array.isRequired,
};

export default FoundDetailsListView;